<template> 
    <el-card class="form-container" shadow="never">
        <el-form :model="post" :rules="postRules" ref="postFrom" label-width="150px">
            <el-form-item label="岗位编码：" prop="postCode">
                <el-input v-model="post.postCode"></el-input>
            </el-form-item>
            <el-form-item label="岗位名称：" prop="postName">
                <el-input v-model="post.postName"></el-input>
            </el-form-item>
            <el-form-item label="显示顺序：" prop="postSort">
                <el-input v-model="post.postSort"></el-input>
            </el-form-item>
            <el-form-item label="状态：" prop="status">
                <el-select v-model="post.status" placeholder="全部" clearable class="input-width">
                    <el-option v-for="item in statusOptions"
                               :key="item.value"
                               :label="item.label"
                               :value="item.value">
                    </el-option>
                </el-select>
            </el-form-item>
            <el-form-item>
                <el-button type="primary" @click="onSubmit('postFrom')">提交</el-button>
                <el-button v-if="!isEdit" @click="resetForm('postFrom')">重置</el-button>
            </el-form-item>
        </el-form>
    </el-card>
</template>
<script>
    import {getPost, addPost, updatePost} from '@/api/sys/post'
    import {isvalidUsername} from '@/utils/validate';

    export default {
        name: 'PostDetail',
        props: {
            isEdit: {
                type: Boolean,
                default: false
            }
        },
        data() {
            return {
                post: {},
                listQuery: {
                    postId: 0,
                    pageNum: 1,
                    pageSize: 100
                },
                postRules: {
                    postCode: [{required: true, trigger: 'blur', message: '请输入职位编码',}],
                    postName: [{required: true, trigger: 'blur', message: '请输入职位名称',}],
                    postSort: [{required: true, trigger: 'blur', message: '请输入排序',}],
                    status: [{required: true, trigger: 'blur', message: '请选择状态',}],
                },
                statusOptions: [
                    {
                        label: '正常',
                        value: 0
                    },
                    {
                        label: '禁用',
                        value: 1
                    }
                ],
            }
        },
        created() {
            if (this.isEdit) {
                // 当前的id
                this.listQuery.postId = this.$route.query.id;
                this.post.postId = this.$route.query.id;
                getPost(this.$route.query.id).then(response => {
                    this.post = response.data;
                });
            }
        },
        methods: {
            // 提交表单
            onSubmit(formName) {
                this.$refs[formName].validate((valid) => {
                    if (valid) {
                        this.$confirm('是否提交数据', '提示', {
                            confirmButtonText: '确定',
                            cancelButtonText: '取消',
                            type: 'warning'
                        }).then(() => {
                            if (this.isEdit) {
                                updatePost(this.post).then(response => {
                                    if (response.code == 200) {
                                        this.$refs[formName].resetFields();
                                        this.$message({
                                            message: '修改成功',
                                            type: 'success',
                                            duration: 1000
                                        });
                                        this.$router.back();
                                    } else {
                                        this.$message({
                                            message: response.msg,
                                            type: 'error',
                                            duration: 1000
                                        });

                                    }
                                });
                            } else {
                                addPost(this.post).then(response => {
                                    if (response.code == 200) {
                                        this.$refs[formName].resetFields();
                                        this.post = {};
                                        this.$message({
                                            message: '提交成功',
                                            type: 'success',
                                            duration: 1000
                                        });
                                        this.$router.back();
                                    } else {
                                        this.$message({
                                            message: response.msg,
                                            type: 'error',
                                            duration: 1000
                                        });
                                    }
                                });
                            }
                        });
                    } else {
                        this.$message({
                            message: '验证失败',
                            type: 'error',
                            duration: 1000
                        });
                        return false;
                    }
                });
            },
            // 重置表单
            resetForm(formName) {
                this.$refs[formName].resetFields();
                this.admin = Object.assign({}, defaultAdmin);
            }
        }
    }
</script>
<style>
</style>


